import { createRouter, createWebHashHistory } from "vue-router"
import store  from "../store/user"
import ApiTesting from "../views/ApiTesting.vue"
import index from "../views/index.vue"
import background from "../views/background.vue"
import user from "../components/background/User.vue"
import login from "../views/login.vue"
import register from "../views/register.vue"
import PersonalManagement from "../views/PersonalManagement.vue"
import BlogBost from "../components/PersonalManagement/BlogBost.vue"
import BlogPublishing from "../views/Publishing.vue"
import ChangePassword from "../components/PersonalManagement/ChangePassword.vue"
import ChangeEmail from "../components/PersonalManagement/ChangeEmail.vue"
import ModifyData from "../components/PersonalManagement/ModifyData.vue"
import BlogContent from "../views/Content.vue"
import CommentManager from "../components/background/CommentManager.vue"
import CarouselManager from "../components/background/CarouselManager.vue"
import ArticleManager from "../components/background/ArticleManager.vue"
import BlogSearch from "../views/Search.vue"
import BlogCategories from "../views/categories.vue"
import ProjectDetails from "../views/ProjectDetails.vue"
import homePage from "../views/homePage.vue"
import followed from "../views/followed.vue"
// 导入vuex 实现路由守卫判断
const userState = store.state.user
const routes = [
  // 首页
  { path: '/',name:"index",component:index,},
  // 登录
  { path: '/login', name:"login",component:login,},
  // 注册
  { path: '/register', name:"register",component:register,},
  // 文章查询页
  { path: '/BlogSearch/:type/:value', name:"BlogSearch",component:BlogSearch,props: route => ({ type:route.params.type ,value: route.params.value })},
  // 文章分类页
  { path: '/BlogCategories/:id', name:"BlogCategories",component:BlogCategories,props: route => ({ id: route.params.id })},
  // 博客发布
  { path: '/BlogPublishing/:BlogId', name:"BlogPublishing",component:BlogPublishing,
  props: route => ({ BlogId: route.params.BlogId }),
  beforeEnter: (to, from, next) => {
    if(userState.id){
      next()
    }
    next("/login")
  }
},
    // 个人主页
    { path: '/homePage/:userID', name:"homePage",component:homePage, props: route => ({ userID: route.params.userID }),
    beforeEnter: (to, from, next) => {
      if(userState.id){
        next()
      }
      next("/login")
    }
  },
  // 个人中心
  { path: '/PersonalManagement', name:"PersonalManagement",component:PersonalManagement,
    beforeEnter: (to, from, next) => {
      if(userState.id){
        next()
      }
      next("/login")
    },
  children:[  
    {
      // 文章管理 兼个人主页
      path:"BlogBost",
      name:"BlogBost",
      component:BlogBost
    },
    { 
      // 密码更改
      path:"ChangePassword",
      name:"ChangePassword",
      component:ChangePassword
    },
    { 
      // 邮箱更改
      path:"ChangeEmail",
      name:"ChangeEmail",
      component:ChangeEmail,
    },
    { 
      // 资料修改
      path:"ModifyData",
      name:"ModifyData",
      component:ModifyData,
    },
  ]
},
  // 内容展示
  { path: '/BlogContent/:BlogId',name:"BlogContent",component:BlogContent,props: route => ({ BlogId: route.params.BlogId })},
  // 后台管理
  { path: '/background', name:"background",component:background,
    beforeEnter: (to, from, next) => {
      if(userState.power>=1){
        next()
      }else if(userState.id)
      next("/")
      next("/login")
    },
  children:[
    {
      // 用户管理
       path: 'user',
       name: 'user',
       component: user
    },
    {
      // api测试
      path: 'ApiTesting',
      name: 'ApiTesting',
      component: ApiTesting
   },
   {
    //评论管理
    path: 'CommentManager',
    name: 'CommentManager',
    component: CommentManager
   },
   {
    //首页轮播
    path: 'CarouselManager',
    name: 'CarouselManager',
    component: CarouselManager
   }
   ,
   {
    //文章管理
    path: 'ArticleManager',
    name: 'ArticleManager',
    component: ArticleManager
   }
  ]
},
// 关于我们
{path: '/ProjectDetails', name:"ProjectDetails",component:ProjectDetails},
// 用户关注
{path: '/followed', name:"followed",component:followed,beforeEnter: (to, from, next) => {
  if(userState.id){
    next()
  }
  next("/login")
}}

]

const router = createRouter({
    history:createWebHashHistory(),
    routes
})
export default router